<script setup>
import {useRoute, useRouter} from "vue-router";

const route = useRoute() // this.$route
const router = useRouter() // this.$router

// todo: props
// 接收传来的参数
const props = defineProps({
  type: String,
  // vid: String
  // item: Object
})

const handleClick = () => {
  setTimeout(() => { // 让按下的动画可以显示出来
    router.push({
      name: props.type === 'video' ? 'video-play' : 'live-room',
    })
  }, 100)
}
</script>

<template>
  <div @click="handleClick"
       class="hover:scale-110 active:scale-95 transition duration-200 flex flex-col items-center justify-center gap-2">
    <img
        class="rounded-lg h-40 w-56"
        src="@/assets/bridge-water-sky-plant-leaf-natural-landscape-1667506-pxhere.com.jpg" alt=""/>
    <span class="text-center truncate overflow-ellipsis w-[75%]">
              旅游实拍vlog ~ day01
            </span>
  </div>
</template>

<style scoped>

</style>